<!-- 收款方式 -->
<template>
	<view style="padding: 30upx;">
		
		<view class="view-card" style="margin-bottom: 140upx;">
			<view style="padding: 0upx 30upx;">
				<view class="row-between item-view" style="border-top: none;">
					<view class="row-start item-title" @click="active = 0">
						<image :src="active== 0 ? imageUrl.select :imageUrl.unsel" mode=""></image>
						<view>支付宝账号</view>
					</view>
					<input class="item-input" type="text" v-model="referenceCode" placeholder-class="inputHolder" placeholder="请输入" />
				</view>
			</view>
			<view style="padding: 0upx 30upx;">
				<view class="row-between item-view">
					<view class="row-start item-title" @click="active = 1">
						<image :src="active== 1 ? imageUrl.select :imageUrl.unsel" mode=""></image>
						<view>银行卡</view>
					</view>
					<view :class="{'item-text': 'ture','active': text == '未绑定'}" @click="gobanbing">
						<text style="margin-right: 15upx;">{{text}}</text>
						<uni-icons v-if="text == '未绑定'" type="arrowright" size="12" color="#ADADAD"/>
					</view>
				</view>
			</view>
		</view>
		
		
		<view class="btn-view">确认修改</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				referenceCode:'',
				imageUrl:{
					select:'/static/assets/select.png',
					unsel:'/static/assets/unsel.png',
				},
				active: 0,
				text: '未绑定'
			}
		},
		methods: {
			gobanbing(){
				if(this.text == '未绑定'){
					uni.navigateTo({
						url: '/pagesUser/bankCard/addCard'
					});
				}
				uni.navigateTo({
					url: '/pagesUser/bankCard/addCard'
				});
			}
		}
	}
</script>

<style scoped lang="scss">

	.view-card{
		background: #FFFFFF;
		border-radius: 10upx;
		.item-view{
			padding: 58upx 0upx;
			font-size: 30upx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
			border-top: 1upx solid #EEEEEE;
			.item-title{
				flex: 1;
				image{
					width: 34upx;
					height: 34upx;
					margin-right: 23upx;
				}
			}
			.item-input{
				text-align: right;
			}
			.inputHolder {
				font-size: 30upx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
			}
			.item-text{
				font-size: 26upx;
				color: #666666;
				&.active{
					color: #EE390B;
				}
			}
		}
	}
	
	.btn-view{
		width: 600upx;
		margin: 0 auto;
		padding: 25upx 0upx;
		background: #FE5E49;
		border-radius: 40upx;
		font-size: 30upx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
		text-align: center;
	}
</style>
